import {Component, Input, OnInit} from '@angular/core';
import {ActivatedRoute} from '@angular/router';
import {ApiService} from '@core/services/http/api.service';
import {Events} from '@core/services/events/Events';
import {ApesMessageService} from "@shared/apes/message";


@Component({
  selector: 'member-info',
  template: `    
    <div style="text-align: center">
      <div *ngFor="let head of topList">
        <!-- 会员 -->
        <div>
          <span *ngFor="let i of head.headVip">
            <i>{{ headVip[i['feild']] }}</i>
          </span>
        </div>
        <!-- 会员级别 手机号 -->
        <div>
          <span *ngFor="let a of head.headTit">
            <i>{{ headTit[a['feild']] }}</i>
            <i *ngIf=" a.lable === '会员类型名称'">&nbsp;/&nbsp;</i>
            <i *ngIf="a.lable === '会员级别名称'">&nbsp;/&nbsp;</i>
          </span>
          <br>
          <span *ngFor="let a of head.headPhone">
            <i>{{ headPhone[a['feild']] }}</i>
            <i *ngIf=" a.lable === '手机号1'">&nbsp;/&nbsp;</i>
          </span>
        </div>

        <apes-divider apesText="余 额" style="font-size: 16px"></apes-divider>
        <div>
          <div *ngFor="let i of head.balance">
            <span>{{ i.lable }}：</span>
            <span>{{ balance[i['feild']] }}</span>
          </div>
        </div>

        <apes-divider apesText="消 费" style="font-size: 16px"></apes-divider>
        <div>
          <div *ngFor="let i of head.consumption">
            <span>{{ i.lable }}：</span>
            <span>{{ consumption[i['feild']] }}</span>
          </div>
        </div>
        
      </div>
    </div>
  `,
  styleUrls: ['../car-list.component.scss']
})
export class MemberInfoComponent implements OnInit {
  @Input()
  set parmes(value: any) {
    this._parmes = value;
  }

  get parmes() {
    return this._parmes;
  }

  _parmes: any;

  // titleData = {};
  topList: any [];
  headVip = {};
  headTit = {};
  headPhone = {};
  balance = {};
  consumption = {};

  constructor(private routeInfo: ActivatedRoute,
              private event: Events,
              private apiService: ApiService,
              private msg: ApesMessageService) {
  }

  ngOnInit() {
    let jjcdh = this.parmes.JJCDH;
    let cphm = this.parmes.CPHM;
    let mdid = this.parmes.MDID;
    this.topList = this.setHeadData();
    this.getHeadData(jjcdh,cphm, mdid);

  }

  getHeadData(api?: any, cphm?: any, mdid?: any) {
    let data = {'interfaceMethod': 'ipmCLZKForAppService.getVIPXX', 'pdata': {'JJCDH': api, 'CPHM': cphm,  'MDID': mdid}};
    this.apiService.post('report.interface', {'body': JSON.stringify(data)}).subscribe(
      (resultData) => {
        const result = JSON.parse(resultData);
        if (result.success) {
          if (result.obj.length !== 0) {
            let data = JSON.parse(result.obj);
            if( data['VIPMC'] === undefined ){
              data['VIP'] = '('+data['VIPID']+')';
            }else {
              data['VIP'] = '('+data['VIPID']+')'+data['VIPMC'];
            }

            this.headVip = data;
            this.headTit = data;
            this.headPhone = data;
            this.balance = data;
            this.consumption = data;
          }
        } else {
          this.msg.info(result.msg);
        }
      });
  }

  // 脑袋数据
  setHeadData() {
    return [
      {
        headVip: [
          {lable: '会员', feild: 'VIP'}
        ],
        headTit: [
          {lable: '会员类型名称', feild: 'VIPLXMC'},
          {lable: '会员级别名称', feild: 'VIPJBMC'},
          {lable: '会员活跃度名称', feild: 'VIPHYDMC'},
        ],
        headPhone: [
          {lable: '手机号1', feild: 'SJHM1'},
          {lable: '手机号2', feild: 'SJHM2'},
        ],
        balance: [
          {lable: '会员卡余额', feild: 'CZYE'},
          {lable: '保险储值金额', feild: 'FXYE'},
        ],
        consumption: [
          {lable: '累计消费金额', feild: 'LJXFJE'},
          {lable: '首次消费日期', feild: 'SCXFRQ_SJ'},
          {lable: '最后消费日期', feild: 'ZHXFRQ_SJ'}
        ]
      }
    ]
  }

}
